<template>
  <el-dialog append-to-body :before-close="cancel" :visible.sync="value">
    <template slot="title">下级会员佣金</template>
    <el-table :data="tabelData" border>
      <el-table-column label="累计上月">
        <template slot-scope="{row}">
          {{row.lastAmount | currency}}
        </template>
      </el-table-column>
      <el-table-column label="公司净输赢">
        <template slot-scope="{row}">
          {{row.winNet | currency}}
        </template>
      </el-table-column>
      <el-table-column label="佣金比例">
        <template slot-scope="{row}">
          {{row.commRate | currency}}
        </template>
      </el-table-column>
      <el-table-column label="佣金">
        <template slot-scope="{row}">
          {{row.commAmount | currency}}
        </template>
      </el-table-column>
    </el-table>
    <p>注：当公司净输赢为负数时候（会员盈利），佣金比例默认为0%</p>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="cancel">确定</el-button>
    </div>
  </el-dialog>
</template>

<script>
  export default {
    name: "nextMemberCommissionDialog",
    props: ["value", "detail"],
    data() {
      return {
        tabelData: []
      };
    },
    methods: {
      cancel() {
        this.$emit("input", false);
      },
    },
    computed: {},
    created() {
      this.tabelData = [{
        lastAmount: this.detail.lastAmount,
        winNet: this.detail.winNet,
        commRate: this.detail.commRate,
        commAmount: this.detail.commAmount
      }]
    }
  };
</script>

<style scoped>
</style>
